document.getElementById('generateButton').addEventListener('click', function() {
    const fileInput = document.getElementById('fileInput');
    const treeContainer = document.getElementById('treeContainer');
    treeContainer.innerHTML = ''; // Clear previous tree

    if (fileInput.files.length === 0) {
        alert('Please select a directory.');
        return;
    }

    const fileTree = {};
    Array.from(fileInput.files).forEach(file => {
        const pathParts = file.webkitRelativePath.split('/');
        let currentLevel = fileTree;

        pathParts.forEach((part, index) => {
            if (!currentLevel[part]) {
                currentLevel[part] = index === pathParts.length - 1 ? file : {};
            }
            currentLevel = currentLevel[part];
        });
    });

    const createTreeHtml = (tree) => {
        const ul = document.createElement('ul');
        for (const key in tree) {
            const li = document.createElement('li');
            li.textContent = key;
            if (typeof tree[key] === 'object') {
                li.appendChild(createTreeHtml(tree[key]));
            }
            ul.appendChild(li);
        }
        return ul;
    };

    treeContainer.appendChild(createTreeHtml(fileTree));
});
